<template>
  <div>
    <el-select
      v-model="formInline.adSource"
      filterable
      clearable
      :multiple="multiple"
      :multiple-limit="3"
      :size="size"
      @change="onChange"
    >
      <el-option
        v-for="(item, index) in adCodeList"
        :key="index"
        :label="item.name"
        :value="item.id"
      ></el-option>
    </el-select>
  </div>
</template>
<script>
import { GETADSOURCEOPTIONS } from "@/http/system";
export default {
  name: "AdCodeSelect",
  props: {
    value: {
      type: [String, Number],
      default: "",
    },
    size: {
      type: String,
      default: "",
    },
    multiple: {
      type: Boolean,
      default: true,
    },
    code: {
      type: [String, Number],
      default: "",
    },
  },
  data() {
    return {
      adCodeList: this.$store.state.adCodeList,
      formInline: {},
    };
  },
  watch: {
    value: {
      handler: function (n, o) {
        console.log(n);
        if (!n) {
          this.formInline = {};
          return false;
        }
        // 多选
        if (this.multiple) {
          this.$set(
            this.formInline,
            "adSource",
            n.split(",").map((k) => Number(k))
          );
        } else {
          this.$set(this.formInline, "adSource", Number(n));
        }
      },
      immediate: true,
    },
    code: {
      handler: function (n, o) {
        if (n) {
          this.getList();
        }
      },
    },
  },
  created() {
    // let n = this.$store.state.adCodeList;
    // if (!n || n.length <= 0) {
    //   this.getList();
    // }
    this.getList();
  },
  methods: {
    // 获取负责人
    getList() {
      let oParams = {};
      if (this.code) {
        oParams.channelSource = this.code;
      }
      GETADSOURCEOPTIONS(oParams).then((res) => {
        let list = res.data || [];
        this.adCodeList = list;
        this.$store.commit("SET_ADCODE_LIST", list);
      });
    },

    // 监听组件变化
    onChange(e) {
      console.log(e);
      this.$emit("input", e.toString());
      this.$emit("change", e);
    },
  },
};
</script>
<style lang="scss" scoped>
</style>